<template>
  <div class="carousel">
    <el-carousel class="el-carousel" trigger="click" height="150px">
      <el-carousel-item v-for="(img,index) in imgList" :key="index">
        <img v-bind:src="img.url">
      </el-carousel-item>
    </el-carousel>
  </div>
</template>

<script>
export default {
  name: 'carousel',
  data() {
    return {
      imgList:[
        {url:require('@/assets/1.jpg')},
        {url:require('@/assets/2.jpg')},
        {url:require('@/assets/3.jpg')},
        {url:require('@/assets/4.jpg')},
      ]

    }
  },
  props: {

  },
  components: {
  },
  mounted() {

  },
  methods: {

  }
}
</script>

<style scoped lang="less">
.carousel {
  border-radius: 20px;
  background: rgba(213, 237, 161, 1);
  box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.25);
  .el-carousel{
    border-radius: 20px;
  }
 
}
</style>
